<template>
	<div>

		<div class="app-container">

			<TopInfo />

			<Search :lookup="data.lookup" @investigate="inves" />

			<div>
				<el-button type="primary" @click="add">{{ $t('presets.info.add') }}</el-button>
			</div>

		</div>

		<div class="app-container" v-loading="data.mtloading">

			<el-table :data="data.list" :header-cell-style="{ 'text-align': 'center' }"
				:cell-style="{ 'text-align': 'center' }" class="w-full">

				<el-table-column prop="wt_id" label="ID" />

				<el-table-column prop="wx_id" :label="$t('presets.info.WeChatID')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.wx_id || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="template_name" :label="$t('presets.info.name')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.template_name || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="template_type" :label="$t('system.mail.type')" show-overflow-tooltip>
					<template #default="scope">
						{{ setType(scope.row) }}
					</template>
				</el-table-column>

				<el-table-column prop="template_id" :label="$t('public.template') + 'ID'" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.template_id || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="url" :label="$t('system.message.url')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.url || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="miniprogram" :label="$t('system.message.MiniUrl')" show-overflow-tooltip>
					<template #default="scope">
						{{ scope.row.miniprogram || '--' }}
					</template>
				</el-table-column>

				<el-table-column prop="status" :label="$t('public.state')">
					<template #default="scope">
						<el-tag type="success" v-if="scope.row.status == 1">{{ $t('public.enable') }}</el-tag>
						<el-tag type="danger" v-if="scope.row.status == 2">{{ $t('public.disable') }}</el-tag>
					</template>
				</el-table-column>

				<el-table-column prop="ao_id" :label="$t('machine.infos.organiz')" show-overflow-tooltip>
					<template #default="scope">
						{{ getaoid(scope.row.ao_id) }}
					</template>
				</el-table-column>

				<el-table-column :label="$t('public.operate')">
					<template #default="scope">
						<el-button size="small" type="primary" @click="modify(scope.row)">{{ $t('public.modify')
							}}</el-button>
						<el-button v-prmis="'wx_template_del'" size="small" type="danger"
							@click="del(scope.row.wt_id)">{{ $t('public.del') }}</el-button>
					</template>
				</el-table-column>

			</el-table>

		</div>

	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
import TopInfo from '@/components/TopInfo/index.vue';
import Search from '@/components/Search/index.vue';
import arrange from '@/utils/hierarchy';
import { gettemplateList, deltemplate } from '@/api/system';
import { useRouter, useRoute } from "vue-router";
const router = useRouter()
const route = useRoute()
let data = reactive({
	mtloading: false, // 加载
	lookup: [ // 筛选栏
		{ title: $t('presets.info.name'), type: 'input', value: '', key: 'template_name' },
		{
			title: $t('system.mail.type'), type: 'define', select: [
				{ label: $t('mock.onlineStatus'), value: 'online' },
				{ label: $t('mock.outStock'), value: 'understock' },
				{ label: $t('mock.saleNotices'), value: 'sale' },
				{ label: $t('mock.abnormal'), value: 'tException' },
				{ label: $t('mock.failure'), value: 'mFault' },
				{ label: $t('mock.abnormality'), value: 'unitException' }
			], value: '', key: 'template_type'
		},
	],
	list: [], // 列表信息
	aolist: [],
	tempinfo: {
		wx_id: '',
		template_name: '',
		template_type: '',
		page: 1,
		pageNum: 15
	},
	total: 0, // 总条数
})
let setType = (row) => {
	if (row.template_type == 'online') {
		row.template_typeCn = $t('mock.onlineStatus')
	}
	if (row.template_type == 'understock') {
		row.template_typeCn = $t('mock.outStock')
	}
	if (row.template_type == 'sale') {
		row.template_typeCn = $t('mock.saleNotices')
	}
	if (row.template_type == 'tException') {
		row.template_typeCn = $t('mock.abnormal')
	}
	if (row.template_type == 'mFault') {
		row.template_typeCn = $t('mock.failure')
	}
	if (row.template_type == 'unitException') {
		row.template_typeCn = $t('mock.abnormality')
	}
	return row.template_typeCn
}
// 获取列表信息
let getlist = () => {
	data.mtloading = true
	data.tempinfo.wx_id = Number(route.query.id)
	gettemplateList(data.tempinfo).then(res => {
		data.mtloading = false
		if (res.state == 200) {
			data.list = res.data.data
			data.total = res.data.total
		}
	})
}

// 获取接口信息
let geturl = async () => {
	let array = await arrange.arrange(1);
	data.aolist = []
	for (let ime of array) {
		data.aolist.push({
			label: ime.organization_name,
			value: ime.ao_id
		})
	}
}

// 查询回调
let inves = (e) => {
	for (let key in e) {
		data.tempinfo[key] = e[key]
	}
	data.tempinfo.page = 1
	data.tempinfo.pageNum = 15
	getlist()
}

// 组织架构名称
let getaoid = (e) => {
	let name = '--'
	for (let item of data.aolist) {
		if (item.value == e) {
			name = item.label
		}
	}
	return name
}

// 添加模板
let add = () => {
	router.push({ path: '/system/message/add_info/index' })
}

// 修改模板
let modify = (e) => {
	let query = {
		l: encodeURI(JSON.stringify({
			info: e
		}))
	}
	router.push({ path: '/system/message/details_info/index', query: query })
}

// 删除模板
let del = (e) => {
	ElMessageBox.confirm($t('message.delDatas'))
		.then(res => {
			deltemplate({ wt_id: e }).then(res => {
				if (res.state == 200) {
					ElMessage({
						message: $t('message.delSuccess'),
						type: 'success'
					})
					getlist()
					return
				}
				ElMessage({
					message: $t('message.networkFailed'),
					type: 'error'
				})
			})
		}).catch(err => {
			console.log('取消')
		})
}

getlist()
geturl()

</script>